// import logo from './logo.svg';

import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
import { Suspense,useEffect } from "react";
import * as type from "../utils/index";
//第三步
import {ErrorBlock} from 'antd-mobile'
import routes from "./RouterConfig";
import setNprogress from 'nprogress'
import 'nprogress/nprogress.css'
//便利组件   渲染路由
//现在换成pc  2024 5 21 10:10:20
type Props = {RouterConfig:type.Data_List};
//jiazai
const Loading=()=>{
    return(<ErrorBlock status='disconnected'/>) 
}
const BeforRouter = ({ Com, title }: { Com: React.ComponentType, title: string }) => {  
    setNprogress.start();  
    useEffect(() => {  
        document.title = title;  
        // ... 其他逻辑 
        setNprogress.done() 
    }, [title]);
return <Com/>
}
const App = (props: Props) => {
  const Render = (arr: type.Data_List) => {
    return arr?.map((item: type.DataItems, index: number) => {
      return <Route
          key={index}
          path={item.path}
          element={item.to ? <Navigate to={item.to} /> :
           < BeforRouter Com={item.element} title={item.title as string}/>}>
          {item.children && Render(item.children)}
        </Route>
      ;
    });
  };
  return (
    <Suspense fallback={<Loading/>}>
      <BrowserRouter>
        <Routes>{Render(routes)}</Routes>
      </BrowserRouter>
    </Suspense>
  )
};

export default App;